<template>
  <div>
    <div class="supplier" v-if="!materialClassAddShow">
      <!-- 面包屑 -->
      <div
        v-if="BreadCrumbsShow"
        :class="
          appStore.sidebar.opened ? 'search-Breadcrumbs' : 'search-Breadcrumbs1'
        "
      >
        <div
          class="Breadcrumbs-item"
          v-for="(item, index) in Breadcrumbs"
          :key="item.folderId"
        >
          <span class="Breadcrumbs-separator">/</span>
          <el-icon
            style="margin-right: 5px; transform: translateY(3px)"
            title="文件夹"
            color="#FF9552"
            :size="20"
          >
            <Folder />
          </el-icon>
          <span
            class="Breadcrumbs-text"
            @click="handlerBreadcrumbs(item, index)"
            >{{ item.folderName }}</span
          >
        </div>
      </div>
      <div>
        <div class="main-top">
          <!-- 筛选按钮 -->
          <div class="search-button">
            <el-button
              v-if="showoperate"
              v-hasPermi="['system:contract:query']"
              class="btn search"
              @click="getOperateList(true)"
              ><el-icon class="icon" color="#fff"> <Search /> </el-icon
              >查询</el-button
            >
            <el-button
              v-if="
                activeindex != 3 &&
                !(
                  Breadcrumbs.length == 1 &&
                  activeindex == 2 &&
                  isAdmin &&
                  !showoperate
                )
              "
              v-preventReClick
              class="btn search"
              @click="
                materialClassAddShow = true;
                pageType = 'add';
              "
              ><el-icon class="icon" color="#fff"> <Plus /> </el-icon
              >新增</el-button
            >
            <div
              style="margin: 5px 10px 0 10px"
              v-if="
                (activeindex != 3 && isAdmin && Breadcrumbs.length != 1) ||
                [0, 1].includes(
                  Breadcrumbs[Breadcrumbs.length - 1].permissionType
                )
              "
            >
              <DOcUpload
                v-model:isLoading="isLoading"
                :fileList="filelist"
                :limit="1"
                accept=".doc,.docx"
                :isFull="true"
                :isCanDelete="true"
                :showButton="filelist == 0"
                :isUploadshow="false"
                :fullLoading="true"
                :maxSize="500 * 1024 * 1024"
                @success="(result) => uploadSuccess(result)"
                @deleteFile="(result) => uploadRemove(result)"
              >
                <!-- :loading="isLoading" -->
                <template #content>
                  <el-button v-preventReClick class="btn save"
                    ><el-icon class="icon" color="#fff"> <Upload /> </el-icon
                    >上传</el-button
                  >
                </template>
              </DOcUpload>
            </div>
            <template v-if="!showoperate">
              <el-button
                v-if="
                  activeindex != 3 &&
                  !(Breadcrumbs.length == 1 && activeindex == 2 && isAdmin)
                "
                v-preventReClick
                class="btn save"
                @click="handleOperate('share')"
                ><el-icon class="icon" color="#fff"> <Share /> </el-icon
                >分享</el-button
              >
              <el-button
                v-if="
                  activeindex != 3 &&
                  !(Breadcrumbs.length == 1 && activeindex == 2 && isAdmin)
                "
                v-preventReClick
                class="btn withdraw"
                @click="handleOperate('deleteChoose')"
                ><el-icon class="icon" color="#fff"> <Delete /> </el-icon
                >删除</el-button
              >
              <el-button
                class="btn add"
                @click="handleRefresh"
                v-if="activeindex != 3"
                ><el-icon class="icon" color="#fff"> <Refresh /> </el-icon
                >重置</el-button
              >
              <el-popover :width="170" trigger="click" placement="bottom">
                <template #reference>
                  <el-button class="btn search" style="width: 100px"
                    ><el-icon class="icon" color="#fff"> <Setting /> </el-icon
                    >显示列</el-button
                  >
                </template>
                <el-checkbox-group
                  v-model="checkList"
                  @change="handleCheckChange"
                >
                  <div v-if="activeindex == 1">
                    <el-checkbox label="name">文件名称</el-checkbox>
                  </div>
                  <div v-if="activeindex == 2">
                    <el-checkbox label="name2">文件名称</el-checkbox>
                  </div>
                  <div v-if="activeindex == 3">
                    <el-checkbox label="name3">分享文件</el-checkbox>
                  </div>
                  <div v-if="activeindex == 1">
                    <el-checkbox label="createUserName">创建者</el-checkbox>
                  </div>
                  <div v-if="activeindex == 2">
                    <el-checkbox label="createUserName2">创建者</el-checkbox>
                  </div>
                  <div v-if="activeindex == 1">
                    <el-checkbox label="createTime">更新时间</el-checkbox>
                  </div>
                  <div v-if="activeindex == 2">
                    <el-checkbox label="createTime2">更新时间</el-checkbox>
                  </div>

                  <div v-if="activeindex == 3">
                    <el-checkbox label="nickName">分享人</el-checkbox>
                  </div>

                  <div v-if="activeindex == 3">
                    <el-checkbox label="splitName">被分享</el-checkbox>
                  </div>
                  <div v-if="activeindex == 3">
                    <el-checkbox label="createTime3">分享时间</el-checkbox>
                  </div>
                </el-checkbox-group>
              </el-popover>
            </template>
            <template v-else>
              <el-button
                class="btn add"
                @click="handleRefresh2"
                v-if="activeindex != 3"
                ><el-icon class="icon" color="#fff"> <Refresh /> </el-icon
                >重置</el-button
              >
              <el-popover :width="170" trigger="click" placement="bottom">
                <template #reference>
                  <el-button class="btn search" style="width: 100px"
                    ><el-icon class="icon" color="#fff"> <Setting /> </el-icon
                    >显示列</el-button
                  >
                </template>
                <el-checkbox-group
                  v-model="checkList"
                  @change="handleCheckChange"
                >
                  <div>
                    <el-checkbox label="operationManName">操作人</el-checkbox>
                  </div>
                  <div>
                    <el-checkbox label="account">用户名</el-checkbox>
                  </div>
                  <div>
                    <el-checkbox label="createTime">操作时间</el-checkbox>
                  </div>
                  <div>
                    <el-checkbox label="operationTypeName"
                      >操作事件</el-checkbox
                    >
                  </div>
                  <div>
                    <el-checkbox label="details">详情</el-checkbox>
                  </div>
                  <div>
                    <el-checkbox label="ipAddress">IP地址</el-checkbox>
                  </div>
                </el-checkbox-group>
              </el-popover>
            </template>
          </div>
        </div>
      </div>
      <div class="back-button">
        <el-button
          v-if="Breadcrumbs.length != 1"
          v-preventReClick
          class="btn add"
          @click="handlerback"
          ><el-icon class="icon" color="#fff"> <Back /> </el-icon
          >返回</el-button
        >
      </div>

      <!-- 筛选条件 -->
      <div class="search" v-if="showoperate">
        <div class="search-item">
          <el-input
            clearable
            v-model="operateParams.operationManName"
            class="search-input"
            maxlength="30"
            placeholder="请输入姓名"
          ></el-input>
        </div>
        <div class="search-item">
          <el-input
            clearable
            v-model="operateParams.account"
            class="search-input"
            maxlength="30"
            placeholder="请输入用户名"
          ></el-input>
        </div>
        <div class="search-item">
          <el-select
            v-model="operateParams.operationType"
            placeholder="请选择操作事件"
            clearable
            class="search-input"
          >
            <el-option
              v-for="dict in operateList"
              :key="dict.value"
              :label="dict.label"
              :value="dict.value"
            />
          </el-select>
        </div>
        <div class="search-item">
          <el-input
            clearable
            v-model="operateParams.ipAddress"
            class="search-input"
            maxlength="30"
            placeholder="请输入登录地址"
          ></el-input>
        </div>
        <div class="search-item">
          <el-date-picker
            v-model="time"
            type="datetimerange"
            range-separator="至"
            start-placeholder="开始时间"
            end-placeholder="结束时间"
            format="YYYY-MM-DD HH:mm:ss"
            date-format="YYYY/MM/DD ddd"
            time-format="A hh:mm:ss"
            value-format="YYYY-MM-DD HH:mm:ss"
            :default-time="[
              new Date(2000, 1, 1, 0, 0, 0),
              new Date(2000, 1, 1, 23, 59, 59),
            ]"
          />
        </div>
      </div>

      <div class="material-container">
        <!--分类数据-->
        <div class="class-container">
          <div
            class="head-container file-search"
            @click="fileSearchShow = true"
            v-if="activeindex == 1 ||activeindex == 2 "
          >
            <el-icon
              style="margin-right: 8px; transform: translateY(4px)"
              title="搜索文件"
              color="#C2C2C2"
              :size="20"
            >
              <Search />
            </el-icon>
            <span>搜索文件</span>
          </div>
          <div
            class="head-container"
            :class="activeindex == 1 ? 'active' : ''"
            @click="handlershare(1)"
          >
            <el-icon
              style="margin-right: 5px; transform: translateY(4px)"
              title="团队文件"
              color="#FF9552"
              :size="20"
            >
              <Files />
            </el-icon>
            团队文件
          </div>
          <div
            class="head-container"
            :class="activeindex == 2 ? 'active' : ''"
            @click="handlershare(2)"
          >
            <el-icon
              style="margin-right: 5px; transform: translateY(4px)"
              title="个人文件"
              color="#409ef3"
              :size="20"
            >
              <User />
            </el-icon>
            个人文件
          </div>
          <div
            class="head-container"
            :class="activeindex == 3 ? 'active' : ''"
            @click="handlershare(3)"
          >
            <el-icon
              style="margin-right: 5px; transform: translateY(4px)"
              title="分享文件"
              color="#409ef3"
              :size="20"
            >
              <Share /> </el-icon
            >分享文件
          </div>
          <div
            v-if="isAdmin"
            class="head-container"
            :class="activeindex == 4 ? 'active' : ''"
            @click="handlershare(4)"
          >
            <el-icon
              style="margin-right: 5px; transform: translateY(4px)"
              title="操作记录"
              color="#409ef3"
              :size="20"
            >
              <Setting /> </el-icon
            >操作记录
          </div>
        </div>
        <!-- 团队、个人文件 -->
        <div style="width: 85%" v-if="!showshare && !showoperate">
          <!-- 表格数据 -->
          <el-table
            v-loading="loading"
            :data="materialClassList"
            border
            height="64vh"
            :header-cell-style="{ 'text-align': 'center', background: 'red' }"
            :header-cell-class-name="cellClass"
            ref="multipleTableRef"
            @select="handleSelectionChange"
            @select-all="handleSelectionAll"
          >
            <!-- @sort-change="sortChange" -->
            <!-- :default-expand-all="true" -->
            <!-- row-key="folderId" -->
            <!-- :tree-props="{ children: 'children', hasChildren: 'hasChildren' }" -->
            <!-- <el-table-column
            type="index"
            label="序号"
            :index="indexMethod"
            width="70"
            align="center"
          /> -->

            <el-table-column
              v-if="!(Breadcrumbs.length == 1 && activeindex == 2 && isAdmin)"
              type="selection"
              width="55"
              align="center"
              :selectable="checkSelectable"
            />
            <el-table-column
              label="文件名称"
              v-if="
                activeindex == 1
                  ? checkList.includes('name')
                  : checkList.includes('name2')
              "
              prop="name"
              :show-overflow-tooltip="true"
              min-width="80"
              sortable
            >
              <template #default="{ row }">
                <!-- <div
                  @click="
                    row.children
                      ? handlerfile(row)
                      : handleOperate('detail', row)
                  "
                > -->
                <el-icon
                  v-if="row.children"
                  style="margin-right: 5px; transform: translateY(4px)"
                  title="文件夹"
                  color="#FF9552"
                  :size="20"
                >
                  <Folder />
                </el-icon>
                <el-icon
                  v-else
                  style="margin-right: 5px; transform: translateY(4px)"
                  title="文件"
                  color="#007CEF"
                  :size="20"
                >
                  <Files />
                </el-icon>
                <span
                  style="cursor: pointer"
                  @click="
                    row.children
                      ? handlerfile(row)
                      : handleOperate('detail', row)
                  "
                  >{{ row.folderName ? row.folderName : row.name }}</span
                >
                <!-- </div> -->
              </template>
            </el-table-column>
            <el-table-column
              label="创建者"
              prop="createUserName"
              v-if="
                activeindex == 1
                  ? checkList.includes('createUserName')
                  : checkList.includes('createUserName2')
              "
              :show-overflow-tooltip="true"
              min-width="80"
              sortable
            >
              <template #default="{ row }"> </template>
            </el-table-column>
            <el-table-column
              label="更新时间"
              prop="createTime"
              v-if="
                activeindex == 1
                  ? checkList.includes('createTime')
                  : checkList.includes('createTime2')
              "
              :show-overflow-tooltip="true"
              min-width="80"
              sortable
            >
            </el-table-column>
            <!-- 操作模式 -->
            <el-table-column
              label="操作"
              :show-overflow-tooltip="true"
              width="150px"
              v-if="!(Breadcrumbs.length == 1 && activeindex == 2 && isAdmin)"
            >
              <template #default="{ row }">
                <div class="table-operate">
                  <!-- <el-icon
                    title="添加下级文件夹"
                    color="#007CEF"
                    class="table-icon"
                    :size="20"
                    @click="handleOperate('add', row)"
                    v-if="row.children"
                  >
                    <DocumentAdd />
                  </el-icon> -->
                  <!-- <DOcUpload
                    v-if="
                      (userStore.id == 1 && row.children) ||
                      (row.children && [0, 1].includes(row.permissionType))
                    "
                    :fileList="filelist"
                    :limit="1"
                    accept=".doc,.docx"
                    :isFull="true"
                    :isCanDelete="true"
                    :showButton="filelist == 0"
                    @success="(result) => uploadSuccess(result)"
                    @deleteFile="(result) => uploadRemove(result)"
                  >
                    <template #content>
                      <el-icon
                        title="上传文件"
                        color="#007CEF"
                        class="table-icon"
                        :size="20"
                        @click="handleOperate('upload', row)"
                      >
                        <Upload />
                      </el-icon>
                    </template>
                  </DOcUpload> -->
                  <el-icon
                    title="下载文件"
                    color="#007CEF"
                    class="table-icon"
                    :size="20"
                    @click="handleOperate('download', row)"
                    v-if="
                      (isAdmin && !row.children) ||
                      (!row.children && row.permissionType != 3)
                    "
                  >
                    <Download />
                  </el-icon>
                  <el-icon
                    title="预览文件"
                    color="#007CEF"
                    class="table-icon"
                    :size="20"
                    @click="handleOperate('detail', row)"
                    v-if="(isAdmin && !row.children) || !row.children"
                  >
                    <Document />
                  </el-icon>
                  <el-icon
                    title="编辑"
                    color="#FFB700"
                    class="table-icon"
                    :size="20"
                    @click="handleOperate('edit', row)"
                    v-if="
                      (isAdmin && row.children) ||
                      (row.children && [0, 1].includes(row.permissionType))
                    "
                  >
                    <Edit />
                  </el-icon>
                  <el-icon
                    title="删除"
                    color="#E33838"
                    class="table-icon"
                    :size="20"
                    @click="handleOperate('delete', row)"
                    v-if="isAdmin || row.permissionType == 0"
                  >
                    <Delete />
                  </el-icon>
                </div> </template
            ></el-table-column>
          </el-table>
        </div>
        <!-- 分享文件 -->
        <div style="width: 85%" v-if="showshare && !showoperate">
          <el-tabs
            type="border-card"
            v-model="activeTab"
            @tab-change="handleTabChange"
          >
            <el-tab-pane label="分享给我的">
              <!-- 表格数据 -->
              <el-table
                v-loading="loading"
                :data="dividedList"
                border
                height="64vh"
                :header-cell-style="{
                  'text-align': 'center',
                  background: 'red',
                }"
              >
                <el-table-column
                  label="分享文件"
                  prop="name"
                  v-if="checkList.includes('name3')"
                  :show-overflow-tooltip="true"
                  min-width="80"
                  sortable
                >
                  <template #default="{ row }">
                    <el-icon
                      v-if="row.children"
                      style="margin-right: 5px; transform: translateY(4px)"
                      title="文件夹"
                      color="#FF9552"
                      :size="20"
                    >
                      <Folder />
                    </el-icon>
                    <el-icon
                      v-else
                      style="margin-right: 5px; transform: translateY(4px)"
                      title="文件"
                      color="#007CEF"
                      :size="20"
                    >
                      <Files />
                    </el-icon>
                    <span
                      @click="
                        row.children
                          ? handlerfile(row)
                          : handleOperate('detail', row)
                      "
                      style="cursor: pointer"
                      >{{ row.children ? row.folderName : row.name }}</span
                    >
                  </template>
                </el-table-column>
                <el-table-column
                  label="分享人"
                  prop="nickName"
                  :show-overflow-tooltip="true"
                  width="400"
                  sortable
                  v-if="
                    Breadcrumbs.length == 1 && checkList.includes('nickName')
                  "
                >
                </el-table-column>
                <el-table-column
                  label="分享时间"
                  prop="createTime"
                  sortable
                  :show-overflow-tooltip="true"
                  min-width="80"
                  v-if="
                    Breadcrumbs.length == 1 && checkList.includes('createTime3')
                  "
                >
                </el-table-column>
                <!-- 操作模式 -->
                <!-- <el-table-column
                  label="操作"
                  :show-overflow-tooltip="true"
                  width="60px"
                  v-if="Breadcrumbs.length == 1"
                >
                  <template #default="{ row }">
                    <div class="table-operate">
                      <el-icon
                        title="停止分享"
                        color="#E33838"
                        class="table-icon"
                        :size="20"
                        @click="handleOperate('stopshare', row)"
                        v-if="Breadcrumbs.length == 1"
                      >
                        <CircleCloseFilled />
                      </el-icon>
                    </div> </template
                ></el-table-column> -->
              </el-table>
            </el-tab-pane>
            <el-tab-pane label="我分享的">
              <!-- 表格数据 -->
              <el-table
                v-loading="loading"
                :data="sharesList"
                border
                height="64vh"
                :header-cell-style="{
                  'text-align': 'center',
                  background: 'red',
                }"
              >
                <el-table-column
                  label="分享文件"
                  prop="name"
                  v-if="checkList.includes('name3')"
                  :show-overflow-tooltip="true"
                  min-width="80"
                >
                  <template #default="{ row }">
                    <el-icon
                      v-if="row.children"
                      style="margin-right: 5px; transform: translateY(4px)"
                      title="文件夹"
                      color="#FF9552"
                      :size="20"
                    >
                      <Folder />
                    </el-icon>
                    <el-icon
                      v-else
                      style="margin-right: 5px; transform: translateY(4px)"
                      title="文件"
                      color="#007CEF"
                      :size="20"
                    >
                      <Files />
                    </el-icon>
                    <span
                      @click="
                        row.children
                          ? handlerfile(row)
                          : handleOperate('detail', row)
                      "
                      style="cursor: pointer"
                      >{{ row.children ? row.folderName : row.name }}</span
                    >
                  </template>
                </el-table-column>
                <el-table-column
                  label="被分享"
                  prop="splitName"
                  :show-overflow-tooltip="true"
                  width="400"
                  v-if="
                    Breadcrumbs.length == 1 && checkList.includes('splitName')
                  "
                >
                  <template #default="{ row }">
                    <div class="shareText">
                      {{
                        row.targetType == 1
                          ? row.splitName
                          : row.targetType == 2
                          ? row.roleNames
                          : row.shareDeptName
                      }}
                    </div>
                  </template>
                </el-table-column>

                <el-table-column
                  label="分享时间"
                  prop="createTime"
                  :show-overflow-tooltip="true"
                  min-width="80"
                  v-if="
                    Breadcrumbs.length == 1 && checkList.includes('createTime3')
                  "
                >
                </el-table-column>
                <!-- 操作模式 -->
                <el-table-column
                  label="操作"
                  :show-overflow-tooltip="true"
                  width="60px"
                  v-if="Breadcrumbs.length == 1"
                >
                  <template #default="{ row }">
                    <div class="table-operate">
                      <el-icon
                        title="停止分享"
                        color="#E33838"
                        class="table-icon"
                        :size="20"
                        @click="handleOperate('stopshare', row)"
                        v-if="Breadcrumbs.length == 1"
                      >
                        <CircleCloseFilled
                      /></el-icon>
                    </div>
                  </template>
                </el-table-column>
              </el-table>
            </el-tab-pane>
          </el-tabs>
        </div>
        <!-- 操作记录 -->
        <div style="width: 85%" v-if="!showshare && showoperate">
          <!-- 表格数据 -->
          <!-- v-loading="loading" -->
          <el-table
            v-loading="operateLoading"
            :data="operateInfoList"
            border
            height="60vh"
            :header-cell-style="{ 'text-align': 'center', background: 'red' }"
            :header-cell-class-name="cellClass"
          >
            <!-- :default-expand-all="true" -->
            <!-- row-key="folderId" -->
            <!-- :tree-props="{ children: 'children', hasChildren: 'hasChildren' }" -->
            <el-table-column
              type="index"
              label="序号"
              :index="indexMethod"
              width="70"
              align="center"
            />
            <el-table-column
              label="操作人"
              sortable
              prop="operationManName"
              v-if="checkList.includes('operationManName')"
              :show-overflow-tooltip="true"
              min-width="80"
            >
            </el-table-column>
            <el-table-column
              sortable
              label="用户名"
              prop="account"
              v-if="checkList.includes('account')"
              :show-overflow-tooltip="true"
              min-width="80"
            >
            </el-table-column>
            <el-table-column
              label="操作时间"
              sortable
              prop="createTime"
              v-if="checkList.includes('createTime')"
              :show-overflow-tooltip="true"
              min-width="80"
            >
            </el-table-column>
            <el-table-column
              label="操作事件"
              sortable
              prop="operationTypeName"
              v-if="checkList.includes('operationTypeName')"
              :show-overflow-tooltip="true"
              min-width="80"
            >
            </el-table-column>
            <el-table-column
              label="详情"
              sortable
              prop="details"
              v-if="checkList.includes('details')"
              :show-overflow-tooltip="true"
              min-width="140"
            >
            </el-table-column>
            <el-table-column
              sortable
              label="IP地址"
              prop="ipAddress"
              v-if="checkList.includes('ipAddress')"
              :show-overflow-tooltip="true"
              min-width="80"
            >
            </el-table-column>
          </el-table>
          <!-- 分页 -->
          <pagination
            class="pagination"
            :total="total"
            v-model:page="operateParams.pageNum"
            v-model:limit="operateParams.pageSize"
            @pagination="getOperateList(false)"
          />
        </div>
      </div>
    </div>
    <documentationAdd
      v-if="materialClassAddShow"
      ref="materialClassAddRef"
      v-model:materialClassAddShow="materialClassAddShow"
      @refreshList="getMaterialClassList"
      :pageType="pageType"
      :materialClassList="screenlist"
      :Breadcrumbs="Breadcrumbs"
      :activeindex="activeindex"
      @clear="clear"
    />
    <!-- 文件搜索 -->
    <el-dialog
      title="文件搜索"
      v-model="fileSearchShow"
      style="margin-top: 20vh !important"
      width="1000px"
      append-to-body
      :close-on-click-modal="false"
      :close-on-press-escape="false"
      :before-close="handleFileSearchClose"
    >
      <template #header="{ close, titleId, titleClass }">
        <div class="my-header">
          <el-icon
            style="margin: 3px 0px 0 0; transform: translateY(4px)"
            title="搜索文件"
            color="#C2C2C2"
            :size="20"
          >
            <Search />
          </el-icon>
          <el-input
            v-model="fileSearchValue"
            class="search-input pass_input"
            maxlength="100"
            placeholder="请输入文件/文件夹名称"
          ></el-input>
          <div class="search-button" style="position: static">
            <el-button
              v-hasPermi="['system:contract:query']"
              class="btn search"
              style="margin: 0"
              @click="getFileSearch"
              ><el-icon class="icon" color="#fff"> <Search /> </el-icon
              >查询</el-button
            >
            <el-button class="btn add" @click="handleSearchRefresh"
              ><el-icon class="icon" color="#fff"> <Refresh /> </el-icon
              >重置</el-button
            >
          </div>
        </div>
      </template>
      <div class="file-box" v-loading="fileLoad">
        <div class="search-none" v-if="!searchFileData.length">
          <div>
            <div class="search-none-pic"></div>
            <div style="text-align: center">暂无数据</div>
          </div>
        </div>
        <div
          v-for="(item, index) in searchFileData"
          :key="index"
          class="file-content"
        >
          <el-icon
            v-if="item.fileFolderType == 1"
            style="margin: -4px 5px 0 0; transform: translateY(4px)"
            title="文件夹"
            color="#FF9552"
            :size="20"
          >
            <Folder />
          </el-icon>
          <el-icon
            v-else
            style="margin-right: 5px; transform: translateY(4px)"
            title="文件"
            color="#007CEF"
            :size="20"
          >
            <Files />
          </el-icon>
          <div class="file-name">
            {{ item.folderName ? item.folderName : item.name }}
          </div>
          <div class="file-create">
            <div>创建者：</div>
            <div>{{ item.createUserName || "无" }}</div>
          </div>
          <div class="file-update">
            <div>更新时间：</div>
            <div>{{ item.createTime }}</div>
          </div>
          <div class="file-tool" v-if="item.fileFolderType == 1">
            <span class="file-tool-item" @click="handleUrl(item)">路径 </span>
            <!-- <span class="file-tool-item" @click="handleOperate('edit', item)">
              编辑 </span
            >|
            <span class="file-tool-item" @click="handleOperate('delete2', item)"
              >删除
            </span> -->
          </div>
          <div class="file-tool" v-else>
            <span class="file-tool-item" @click="handleUrl(item)">路径 </span>
            <!-- <span
              class="file-tool-item"
              @click="handleOperate('download', item)"
              >下载 </span
            >|
            <span class="file-tool-item" @click="handleOperate('detail', item)">
              预览 </span
            >|
            <span class="file-tool-item" @click="handleOperate('delete2', item)"
              >删除
            </span> -->
          </div>
        </div>
      </div>
    </el-dialog>
  </div>
</template>

<script setup>
import { getDictsApi } from "@/api/dict";
import documentationAdd from "./documentationAdd.vue";
import DOcUpload from "@/components/Upload/index";
const { proxy } = getCurrentInstance();
import { addTableHeaderApi, getTableHeaderApi } from "@/api/pub";
import { ElMessage, ElMessageBox, ElLoading } from "element-plus";
import {
  getmanagementListApi,
  getSearchFileApi,
  getOperateListApi,
  getuploadApi,
  getdeletedocApi,
  deleteChooseDocApi,
  getdeleteApi,
  getselectFolderShareListApi,
  getremoveShareListApi,
  addOpearteApi,
} from "@/api/information/documentation.js";
import { Base64 } from "js-base64";
import useUserStore from "@/store/modules/user";
import useAppStore from "@/store/modules/app";
import { nextTick } from "vue";
const appStore = useAppStore();
//当前用户信息
const userStore = useUserStore();

const checkList = ref([
  "name",
  "name2",
  "name3",
  "createUserName",
  "createUserName2",
  "createTime",
  "createTime2",
  "createTime3",
  "nickName",
  "splitName",
  "operationManName",
  "account",
  "createTime",
  "operationTypeName",
  "details",
  "ipAddress",
]);

// 搜索参数
const params = reactive({
  fileName: "",
  folderName: "",
  superMan: false,
  sortField: "",
  sortOrder: "",
});

const operateParams = reactive({
  account: "",
  beginTime: "",
  endTime: "",
  ipAddress: "",
  operationManName: "",
  operationType: null,
  pageNum: 1,
  pageSize: 50,
});

//筛选时间
let time = ref([]);
// 表格加载效果
const loading = ref(false);
// 文件搜索弹窗显示隐藏
const fileSearchShow = ref(false);
// 文件搜索值
const fileSearchValue = ref("");
// 搜索列表
const searchFileData = ref([]);
const operateLoading = ref(false);
// 物料分类新增组件显隐
const materialClassAddShow = ref(false);
// 物料分类列表
const materialClassList = ref([]);
// 操作记录列表
const operateInfoList = ref([]);
// 总数
const total = ref(0);
// 物料分类新增组件引用
const materialClassAddRef = ref(null);
// 操作类型
const pageType = ref("");
//分享文件
const showshare = ref(false);
// 操作记录
const showoperate = ref(false);
//文件类型
const activeindex = ref(1);
// 表格选中项
const multipleSelection = ref([]);
const multipleTableRef = ref(null);
const operateList = ref([]);
//tab
const activeTab = ref("0");
//上传状态
let isLoading = ref(false);
// 是否为超级管理员角色
let isAdmin = ref(false);

/**
 * @description: 复选框选中
 */
const handleCheckChange = async (val) => {
  var str = val.join(",");
  const result = await addTableHeaderApi({
    moduleType: 6,
    titleField: str,
  });
};

/**
 * @description: 获取表头
 */
const getTableHeader = async () => {
  const result = await getTableHeaderApi({
    moduleType: 6,
  });
  if (result.code == 200) {
    var arr = result.data.titleField.split(",");
    checkList.value = arr;
  }
};

/**
 * @description: 重置
 */
const handleRefresh = () => {
  Object.assign(params, {
    fileName: "",
    folderName: "",
    sortField: "",
    sortOrder: "",
  });
  getMaterialClassList();
  multipleSelection.value = [];
};

/**
 * @description: 重置文件搜索
 */
const handleSearchRefresh = () => {
  fileSearchValue.value = "";
  searchFileData.value = [];
};

/**
 * @description: 获取文件搜索数据
 */
const fileLoad = ref(false)
const getFileSearch = async () => {
  fileLoad.value = true
  console.log("文件搜索");
  const res = await getSearchFileApi({
    name: fileSearchValue.value,
    superMan: params.superMan,
  });
  console.log("重置文件搜索");
  console.log(res);
  fileLoad.value = false
  if (res.code === 200) {
    if(!res.data.length) {
       ElMessage.error('暂无数据')
    }
    searchFileData.value = res.data;
  }

};

/**
 * @description: 列表排序
 * @param {*} column.prop //当前排序取的字段
 * @param {*} column.order // "desc" "asc" 正序或倒序
 */
const sortChange = (column) => {
  params.sortField = column.prop;
  if (column.order === "descending") {
    params.sortOrder = "DESC"; // 排序或倒序
  } else {
    params.sortOrder = "ASC"; // 排序或倒序
  }
  getMaterialClassList();
};

/**
 * @description: 重置
 */
const handleRefresh2 = () => {
  time.value = [];
  Object.assign(operateParams, {
    account: "",
    beginTime: "",
    endTime: "",
    ipAddress: "",
    operationManName: "",
    operationType: null,
    pageNum: 1,
    pageSize: 50,
  });
  getOperateList();
};

/**
 * @description: 文件操作
 */
let Breadcrumbs = ref([
  {
    folderId: 0,
    folderName: "全部",
  },
]); //面包
/**
 * @description: tab改变
 */
const handleTabChange = (value) => {
  switch (value) {
    case "0":
      Breadcrumbs.value = [
        {
          folderId: 0,
          folderName: "全部",
        },
      ];
      dividedList.value = alldividedList.value;
      break;
    case "1":
      Breadcrumbs.value = [
        {
          folderId: 0,
          folderName: "全部",
        },
      ];
      sharesList.value = allsharesList.value;
      break;
    default:
      break;
  }
};
/**
 * @description: 返回上一级
 */
const handlerback = async () => {
  switch (activeindex.value) {
    case 1:
      // 全部
      if (Breadcrumbs.value.length - 1 == 0) {
        materialClassList.value = allmaterialClassList.value;
      } else {
        if (Breadcrumbs.value[Breadcrumbs.value.length - 2].folderId == 0) {
          materialClassList.value = allmaterialClassList.value;
          Breadcrumbs.value = [
            {
              folderId: 0,
              folderName: "全部",
            },
          ];
        } else {
          console.log("-2");
          materialClassList.value =
            Breadcrumbs.value[Breadcrumbs.value.length - 2].children;
          Breadcrumbs.value.pop();
        }
      }
      break;
    case 2:
      if (Breadcrumbs.value.length - 1 == 0) {
        materialClassList.value = allmaterialClassList.value;
      } else {
        if (Breadcrumbs.value[Breadcrumbs.value.length - 2].folderId == 0) {
          materialClassList.value = allmaterialClassList.value;
          Breadcrumbs.value = [
            {
              folderId: 0,
              folderName: "全部",
            },
          ];
        } else {
          materialClassList.value =
            Breadcrumbs.value[Breadcrumbs.value.length - 2].children;
          Breadcrumbs.value.pop();
        }
      }
      break;
    case 3:
      if (activeTab.value == 0) {
        if (Breadcrumbs.value.length - 1 == 0) {
          dividedList.value = alldividedList.value;
        } else {
          if (Breadcrumbs.value[Breadcrumbs.value.length - 2].folderId == 0) {
            dividedList.value = alldividedList.value;
            Breadcrumbs.value = [
              {
                folderId: 0,
                folderName: "全部",
              },
            ];
          } else {
            dividedList.value =
              Breadcrumbs.value[Breadcrumbs.value.length - 2].children;
            Breadcrumbs.value.pop();
          }
        }
      } else {
        if (Breadcrumbs.value.length - 1 == 0) {
          sharesList.value = allsharesList.value;
        } else {
          if (Breadcrumbs.value[Breadcrumbs.value.length - 2].folderId == 0) {
            sharesList.value = allsharesList.value;
            Breadcrumbs.value = [
              {
                folderId: 0,
                folderName: "全部",
              },
            ];
          } else {
            sharesList.value =
              Breadcrumbs.value[Breadcrumbs.value.length - 2].children;
            Breadcrumbs.value.pop();
          }
        }
      }
      break;

    default:
      break;
  }

  await getMaterialClassList();
  handleToogleRow();
};

/**
 * @description: 处理选中
 */
const handleToogleRow = () => {
  if (!materialClassList.value) return;
  if (!multipleSelection.value) return;
  console.log("处理选中");
  console.log(materialClassList.value);
  console.log(multipleSelection.value);
  materialClassList.value.forEach((row) => {
    multipleSelection.value.forEach((ele) => {
      if (ele.children) {
        if (ele.folderId === row.folderId) {
          nextTick(() => {
            multipleTableRef.value.toggleRowSelection(row, true);
          });
        }
      } else {
        if (ele.fileId === row.fileId) {
          nextTick(() => {
            multipleTableRef.value.toggleRowSelection(row, true);
          });
        }
      }
    });
  });
};

const handleUrl = async (row) => {
  if(row.folderType == 1) {
    activeindex.value = 2
  }else {
    activeindex.value = 1
  }
  fileSearchValue.value = "";
  searchFileData.value = [];
  fileSearchShow.value = false;
  await handlerfile(row);
  console.log("row");
  console.log(row);
  console.log(row.folderList);
  Breadcrumbs.value = [
    {
      folderId: 0,
      folderName: "全部",
    },
    ...row.folderList,
  ];
  if(row.fileFolderType == 2) {
    getMaterialClassList();
  }
};

/**
 * @description: 文件展开下一级
 */
const handlerfile = async (row) => {
  switch (activeindex.value) {
    case 1:
      materialClassList.value = row.children;
      Breadcrumbs.value.push(row);
      allmaterialClassList.value = JSON.parse(JSON.stringify(teamlist.value));
      break;
    case 2:
      materialClassList.value = row.children;
      Breadcrumbs.value.push(row);
      allmaterialClassList.value = JSON.parse(JSON.stringify(personlist.value));
      break;
    case 3:
      if (activeTab.value == 0) {
        dividedList.value = row.children;
        Breadcrumbs.value.push(row);
      } else {
        sharesList.value = row.children;
        Breadcrumbs.value.push(row);
      }
      break;

    default:
      break;
  }

  await getMaterialClassList();
  handleToogleRow();
};

/**
 * @description: 全员文件不分享
 */
const checkSelectable = (row) => {
  if (row.isAll == 1) {
    return false;
  } else {
    return true;
  }
};

/**
 * @description: 隐藏表头中的全选框
 */
const cellClass = (row) => {
  if (row.columnIndex === 0) {
    return "disabledCheck";
  }
};
/**
 * @description: 处理面包屑下级
 */
const handlerBreadcrumbs = async (item, index) => {
  console.log("文件路径");
  console.log(Breadcrumbs.value);
  if (item.folderId == 0) {
    switch (activeindex.value) {
      case 1:
        materialClassList.value = allmaterialClassList.value;
        Breadcrumbs.value = [
          {
            folderId: 0,
            folderName: "全部",
          },
        ];
        break;
      case 2:
        materialClassList.value = allmaterialClassList.value;
        Breadcrumbs.value = [
          {
            folderId: 0,
            folderName: "全部",
          },
        ];
        break;
      case 3:
        if (activeTab.value == 0) {
          dividedList.value = alldividedList.value;
          Breadcrumbs.value = [
            {
              folderId: 0,
              folderName: "全部",
            },
          ];
        } else {
          sharesList.value = allsharesList.value;
          Breadcrumbs.value = [
            {
              folderId: 0,
              folderName: "全部",
            },
          ];
        }
        break;
      default:
        break;
    }
  } else {
    switch (activeindex.value) {
      case 1:
        materialClassList.value = item.children;
        Breadcrumbs.value.splice(index + 1);
        break;
      case 2:
        materialClassList.value = item.children;
        Breadcrumbs.value.splice(index + 1);
        break;
      case 3:
        if (activeTab.value == 0) {
          dividedList.value = item.children;
          Breadcrumbs.value.splice(index + 1);
        } else {
          sharesList.value = item.children;
          Breadcrumbs.value.splice(index + 1);
        }
        break;
      default:
        break;
    }
  }
  await getMaterialClassList();
  handleToogleRow();
};
/**
 * @description: 处理文件分享
 */
let sharesList = ref([]);
let dividedList = ref([]);
let allsharesList = ref([]);
let alldividedList = ref([]);
const handlershare = (type) => {
  activeindex.value = type;
  switch (type) {
    case 1:
      handleRefresh();
      showshare.value = false;
      showoperate.value = false;
      materialClassList.value = teamlist.value;
      allmaterialClassList.value = JSON.parse(JSON.stringify(teamlist.value));
      break;
    case 2:
      handleRefresh();
      showshare.value = false;
      showoperate.value = false;
      materialClassList.value = personlist.value;
      allmaterialClassList.value = JSON.parse(JSON.stringify(personlist.value));
      break;
    case 3:
      showshare.value = true;
      showoperate.value = false;
      getselectFolderShareListApi().then((res) => {
        sharesList.value = res.shares;
        dividedList.value = res.divided;
        allsharesList.value = JSON.parse(JSON.stringify(sharesList.value));
        alldividedList.value = JSON.parse(JSON.stringify(res.divided));
      });
      break;
    case 4:
      handleRefresh2();
      showshare.value = false;
      showoperate.value = true;
      // materialClassList.value = personlist.value;
      // allmaterialClassList.value = JSON.parse(JSON.stringify(personlist.value));
      break;

    default:
      break;
  }
  Breadcrumbs.value = [
    {
      folderId: 0,
      folderName: "全部",
    },
  ];
};
/**
 * @description: 返回清除
 */
const clear = () => {
  multipleSelection.value = [];
};
/**
 * @description: 处理表格选中
 */
const handleSelectionChange = (list, row) => {
  console.log("处理表格选中");
  console.log(multipleSelection.value);
  materialClassList.value.forEach((ele) => {
    if (row.children) {
      if (ele.folderId == row.folderId) {
        if (multipleSelection.value.includes(ele)) {
          multipleTableRef.value.toggleRowSelection(ele, false);
          multipleSelection.value = multipleSelection.value.filter((item) => {
            return item.folderId != row.folderId;
          });
        } else {
          multipleTableRef.value.toggleRowSelection(ele, true);
          multipleSelection.value.push(ele);
        }
      }
    } else {
      if (ele.fileId == row.fileId) {
        if (multipleSelection.value.includes(ele)) {
          multipleTableRef.value.toggleRowSelection(ele, false);
          multipleSelection.value = multipleSelection.value.filter((item) => {
            return item.folderId != row.folderId;
          });
        } else {
          multipleTableRef.value.toggleRowSelection(ele, true);
          multipleSelection.value.push(ele);
        }
      }
    }
  });
};
/**
 * @description: 表格全选
 */
const handleSelectionAll = (list) => {
  multipleSelection.value = list;
};

/**
 * @description: 获取操作记录列表
 */
const getOperateList = async (flag = false) => {
  if (flag) {
    operateParams.pageNum = 1;
  }
  try {
    operateLoading.value = true;
    if (time.value != null && time.value.length > 0) {
      operateParams.beginTime = time.value[0];
      operateParams.endTime = time.value[1];
    } else {
      operateParams.beginTime = "";
      operateParams.endTime = "";
    }
    let {
      account,
      ipAddress,
      beginTime,
      operationManName,
      operationType,
      endTime,
      pageNum,
      pageSize,
      sortField,
      sortOrder,
    } = operateParams;
    const res = await getOperateListApi(
      { pageNum, pageSize },
      {
        account,
        ipAddress,
        beginTime,
        operationManName,
        operationType,
        endTime,
        sortField,
        sortOrder,
      }
    );
    if (res.code == 200) {
      operateInfoList.value = res.rows;
      total.value = res.total;
      operateLoading.value = false;
    }
  } catch (error) {
    operateLoading.value = false;
  }
};
/**
 * @description: 获取物料分类列表
 */
let screenlist = [];
let personlist = ref([]);
let teamlist = ref([]);
let allmaterialClassList = ref([]);
let BreadCrumbsShow = ref(true);
const getMaterialClassList = async () => {
  BreadCrumbsShow.value = false;
  setTimeout(() => {
    BreadCrumbsShow.value = true;
  }, 3000);
  let array = [];
  try {
    loading.value = true;
    const res = await getmanagementListApi(params);
    screenlist = res.data;
    // let treeData = proxy.handleTree(res.data, "folderId", "parentFolderId");
    // materialClassList.value = treeData;
    screenlist.forEach((element) => {
      if(element.children) {
        element.children.forEach((jtem) => {
          jtem.parentFolderId = element.folderId;
          jtem.permissionType = element.permissionType;
        });
      }
      screenlist.forEach((item, index) => {
        if (element.folderId == item.parentFolderId) {
          if(element.children) {
            element.children.unshift(item);
          }
          // screenlist.splice(index, 1)
        }
      });
    });
    screenlist = screenlist.filter((item) => {
      return item.parentFolderId == null;
    });

    teamlist.value = screenlist.filter((item) => {
      return item.folderType == 0;
    });

    personlist.value = screenlist.filter((item) => {
      return item.folderType == 1;
    });
    if (personlist.value.length && !isAdmin.value) {
      personlist.value[0].children.forEach((personItem) => {
        personItem.parentFolderId = null;
      });
    }
    if (personlist.value.length && !isAdmin.value) {
      personlist.value = personlist.value[0].children;
    }
    if (activeindex.value == 1) {
      if (Breadcrumbs.value[Breadcrumbs.value.length - 1].folderId == 0) {
        materialClassList.value = teamlist.value;
      } else {
        let arr = res.data.filter((item, index) => {
          return (
            Breadcrumbs.value[Breadcrumbs.value.length - 1].folderId ==
            item.folderId
          );
        });
        materialClassList.value = arr[0].children;
      }

      allmaterialClassList.value = JSON.parse(JSON.stringify(teamlist.value));
    } else {
      if (Breadcrumbs.value[Breadcrumbs.value.length - 1].folderId == 0) {
        materialClassList.value = personlist.value;
      } else {
        let arr = res.data.filter((item, index) => {
          return (
            Breadcrumbs.value[Breadcrumbs.value.length - 1].folderId ==
            item.folderId
          );
        });
        materialClassList.value = arr[0].children;
      }
      console.log("1");
      console.log(personlist.value);
      allmaterialClassList.value = JSON.parse(JSON.stringify(personlist.value));
    }
    // multipleSelection.value = [];
    // total.value = res.total;
    loading.value = false;
    BreadCrumbsShow.value = true;
  } catch {
    loading.value = false;
    BreadCrumbsShow.value = true;
  }
};

/**
 * @description: 文件下载
 * @param {Object} row  当前行数据
 */
const fileDown = async (row) => {
  const res = await addOpearteApi({
    name: row.name,
    operationType: 4,
  });
  // const res = fileDownload(row.url);
  // var debug = res;
  // if (debug) {
  // 创建隐藏的可下载链接  //url下载
  if (row.url) {
    let eleLink = document.createElement("a");
    eleLink.download = row.name;
    eleLink.style.display = "none";
    eleLink.href = row.url;
    // 触发点击
    document.body.appendChild(eleLink);
    eleLink.click();
    // 然后移除
    document.body.removeChild(eleLink);
  }

  // var elink = document.createElement("a");
  // elink.download = row.name;
  // elink.style.display = "none";
  // var blob = new Blob([debug], { type: "application/octet-stream" });
  // elink.href = URL.createObjectURL(blob);
  // document.body.appendChild(elink);
  // elink.click();
  // document.body.removeChild(elink);
  // } else {
  //   this.$message.error($t("common.DownloadException"));
  // }
};
/**
 * @description: 表格操作
 * @param {String} type 类型
 * @param {Object} row  当前行数据
 */
const handleOperate = async (type, row) => {
  switch (type) {
    case "add":
      materialClassAddShow.value = true;
      pageType.value = "add";
      //操作上传
      // nextTick(() => {
      //   materialClassAddRef.value.handleParentId(row);
      // });
      break;
    case "detail":
      console.log();
      let docUrl = row.url;
      let url = encodeURIComponent(Base64.encode(docUrl));
      let officeUrl =
        "http://101.71.158.60:50098/onlinePreview?url=" +
        url +
        "&watermarkTxt=" +
        encodeURIComponent(userStore.nickName); // 在新窗口打开编码后的链接
      window.open(officeUrl, "_target");
      break;
    case "upload":
      // folderId.value = row.folderId;
      break;
    case "download":
      fileDown(row);
      break;
    case "edit":
      fileSearchValue.value = "";
      searchFileData.value = [];
      fileSearchShow.value = false;
      materialClassAddShow.value = true;
      pageType.value = "edit";
      nextTick(() => {
        materialClassAddRef.value.handleDetailInfo(row);
      });
      break;
    case "share":
      if (multipleSelection.value.length == 0) {
        ElMessage.error("请选择要分享的文件");
        return;
      }
      materialClassAddShow.value = true;
      pageType.value = "share";
      nextTick(() => {
        materialClassAddRef.value.handleShareInfo(multipleSelection.value);
      });
      break;
    case "deleteChoose":
      if (multipleSelection.value.length == 0) {
        ElMessage.error("请选择要删除的文件");
        return;
      }
      // 验证权限
      if (!isAdmin.value && multipleSelection.value.some(item => item.permissionType !== 0)) {
         return ElMessage.error("选中项中存在没有权限选项，请重新选择！");; 
      }
      
      console.log("选中文件》》》》》》");
      console.log(multipleSelection.value);
      ElMessageBox.confirm(
        "此操作将删除选中的文件或文件夹，是否继续？",
        "提示",
        {
          confirmButtonText: "确定",
          cancelButtonText: "取消",
          confirmButtonClass: "confirmBtnClass",
          cancelButtonClass: "cancelBtnClass",
          type: "warning",
        }
      )
        .then(async () => {
          let info = JSON.parse(JSON.stringify(multipleSelection.value));
          info.forEach((item) => {
            if (item.children) {
              item.type = 1;
            } else {
              item.type = 0;
              item.folderId = item.fileId;
            }
          });
          let res = await deleteChooseDocApi(info);
          if (res.code === 200) {
            ElMessage.success(res.msg);
            multipleSelection.value = [];
            console.log("滞空");
            console.log(multipleSelection.value);
            // setTimeout(() => {
            getMaterialClassList();
            // }, 500);
          } else {
            ElMessage.error(res.msg);
          }
        })
        .catch(() => {});
      break;
    case "stopshare":
      ElMessageBox.confirm("此操作将停止分享文件或文件夹，是否继续？", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        confirmButtonClass: "confirmBtnClass",
        cancelButtonClass: "cancelBtnClass",
        type: "warning",
      })
        .then(async () => {
          getremoveShareListApi({
            folderId: [row.folderId],
            shareType: row.shareType,
          }).then((res) => {
            if (res.code === 200) {
              ElMessage.success(res.msg);
              getselectFolderShareListApi().then((res) => {
                sharesList.value = res.shares;
                dividedList.value = res.divided;
              });
            } else {
              ElMessage.error(res.msg);
            }
          });
        })
        .catch(() => {});
      break;
    case "delete":
      ElMessageBox.confirm("此操作将删除文件或文件夹，是否继续？", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        confirmButtonClass: "confirmBtnClass",
        cancelButtonClass: "cancelBtnClass",
        type: "warning",
      })
        .then(async () => {
          let res;
          if (row.children) {
            res = await getdeletedocApi(row.folderId);
          } else {
            res = await getdeleteApi(row.fileId);
          }
          if (res.code === 200) {
            ElMessage.success(res.msg);
            getMaterialClassList();
          } else {
            ElMessage.error(res.msg);
          }
        })
        .catch(() => {});
      break;
    case "delete2":
      console.log("row");
      console.log(row);
      ElMessageBox.confirm("此操作将删除文件或文件夹，是否继续？", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        confirmButtonClass: "confirmBtnClass",
        cancelButtonClass: "cancelBtnClass",
        type: "warning",
      })
        .then(async () => {
          let res;
          if (row.fileFolderType == 1) {
            res = await getdeletedocApi(row.folderId);
          } else {
            res = await getdeleteApi(row.folderId);
          }
          if (res.code === 200) {
            ElMessage.success(res.msg);
            getFileSearch();
          } else {
            ElMessage.error(res.msg);
          }
        })
        .catch(() => {});
      break;

    default:
      break;
  }
};
/**
 * @description: 处理文件搜索弹窗关闭
 */
function handleFileSearchClose() {
  console.log("关闭处理");
  fileSearchShow.value = false;
  fileSearchValue.value = "";
  searchFileData.value = [];
}
const filelist = ref([]);
let folderId = ref("");
/**
 * @description: 文件上传成功处理
 * @param {Object} response 文件信息
 */
function uploadSuccess(response) {
  console.log("111");
 

  let obj = {
    ...response,
    folderId: Breadcrumbs.value[Breadcrumbs.value.length - 1].folderId,
  };
  getuploadApi(obj).then((res) => {
    if (res.code == 200) {
      handleRefresh();
     
    } 
  });
}

/**
 * @description: 删除文件
 * @param {Number} index 当前文件索引
 */
function uploadRemove(index) {
  filelist.value.splice(index, 1);
}

/**
 * @description: 序号
 * @param {Number} index 索引
 */
function indexMethod(index) {
  const currentPage = operateParams.pageNum;
  const pageSize = operateParams.pageSize;
  const truelndex = (currentPage - 1) * pageSize + index + 1;
  return truelndex;
}

/**
 * @description: 获取字典
 */
async function getDicts() {
  //出库类型
  await getDictsApi("erp_operation_type").then((res) => {
    if (res.code === 200) {
      operateList.value = res.data;
    }
  });
}

onMounted(() => {
  getTableHeader();
  userStore.roles.forEach((item) => {
    if (item == "admin") {
      isAdmin.value = true;
      params.superMan = true;
    }
  });
  getDicts();
  getMaterialClassList();
  getOperateList();
});
</script>
<style>
@import "@/assets/styles/confirmBtn.css";
.el-dialog__header {
  border-bottom: 1px solid #eee !important;
}
</style>
<style lang="scss" scoped>
.my-header {
  display: flex;
}
.file-box {
  height: 300px;
  overflow: auto;
  .search-none-pic {
    width: 400px;
    height: 200px;
    background: url("@/assets/images/search-none.png") no-repeat;
  }
  .search-none {
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
  }
  .file-content {
    height: 60px;
    cursor: pointer;
    display: flex;
    align-items: center;
    padding-left: 10px;
    &:hover {
      background-color: #eee;
    }
    .file-name {
      width: 570px;
      padding-right: 40px;
    }
    .file-create {
      width: 120px;
      color: #8d8d8d;
    }
    .file-update {
      width: 170px;
      color: #8d8d8d;
    }
    .file-tool {
      .file-tool-item {
        color: #1890ff;
        &:hover {
          color: #0048ff;
        }
      }
    }
  }
}
.pass_input {
  width: 700px !important;
  // 去除文件搜索框外边框
  :deep(.el-input__wrapper) {
    box-shadow: 0 0 0 0px var(--el-input-border-color, var(--el-border-color))
      inset;
  }
}
.supplier {
  padding: 20px 15px 20px 20px;
  width: 100%;
  height: 100%;
  .main-top {
    padding: 20px 0 0 20px;
    display: flex;
    align-items: center;
    // padding-left: 20px;
    height: 56px;
    background: #f8faff;
    margin-bottom: 10px;
    margin-top: -12px;
  }
  .search-button {
    position: static;
    //top: 174px;
    //left: 290px;
    width: 1000px;
  }
  .back-button {
    position: fixed;
    top: 110px;
    right: 50px;
    display: flex;
    .btn {
      display: flex;
      justify-content: center;
      align-items: center;
      width: 90px;
      height: 34px;
      padding: 10px;
      // margin-right: 20px;
      font-size: 14px;
      border-radius: 4px;
      user-select: none;
      cursor: pointer;
    }
    .btn.add {
      border: none;
      color: #fff;
      background: rgba(255, 159, 0, 1);
      &:hover {
        background: rgba(255, 159, 0, 0.85);
      }
    }
  }
  .search-Breadcrumbs {
    transition: all 0.3s;
    position: fixed;
    top: 100px;
    left: 500px;
    display: flex;
    z-index: 10000;
    height: 56px;
    line-height: 56px;
    .Breadcrumbs-item {
      .Breadcrumbs-separator {
        display: inline-block;
        margin: 0 9px;
        font-weight: 700;
        color: var(--el-text-color-placeholder);
        font-size: 18px;
      }
      .Breadcrumbs-text {
        display: inline-block;
        transform: translateY(-2px);
        cursor: pointer;
      }
    }
  }
  .search-Breadcrumbs1 {
    transition: all 0.3s;
    position: fixed;
    top: 100px;
    left: 300px;
    display: flex;
    z-index: 10000;
    height: 56px;
    line-height: 56px;
    .Breadcrumbs-item {
      .Breadcrumbs-separator {
        display: inline-block;
        margin: 0 9px;
        font-weight: 700;
        color: var(--el-text-color-placeholder);
        font-size: 18px;
      }
      .Breadcrumbs-text {
        display: inline-block;
        transform: translateY(-2px);
        cursor: pointer;
      }
    }
  }
  .material-container {
    display: flex;

    .class-container {
      width: 240px;
      margin-right: 10px;
      padding: 30px 0 0 0px;
      background: #ffffff;
      box-shadow: 0px 0px 10px 0px rgba(26, 43, 26, 0.1);
      border-radius: 2px;
      overflow: auto;
      .file-search {
        margin-bottom: 10px;
        border-bottom: 1px solid #c2c2c2;
      }
      .head-container {
        cursor: pointer;
        padding: 10px 0;
        padding-left: 10px;
      }
      .active {
        background-color: #f1f1f1;
      }
      .class-top {
        display: flex;
        justify-content: center;
        margin-bottom: 20px;
        .class-input {
          width: 180px;
        }
      }
    }
    .span-ellipsis {
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
    }
  }
  .pagination {
    margin-top: 20px;
  }
  :deep(.el-upload) {
    width: unset;
    height: 20px;
    transform: translateY(3px);
  }
  /* 去掉全选按钮 */
  // :deep(.el-table .disabledCheck .cell .el-checkbox__inner) {
  //   display: none !important;
  // }
  .shareText {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
}
</style>
